@font-face
{
    font-family: 'Akira'; 
    src: url('../police/Akira.otf');
}/*précise quelle police on utilise*/

@font-face {
    font-family: 'Galyon-Book';
    src: url('../police/Galyon-Book.otf');
}


body {
    background-color: black;
    width:auto;
    height:auto;
    max-width: 1920px;
    max-height: 1080px;
    margin: auto;
    overflow-x:hidden;
}






#triangle{
    float: left;
    position:absolute;
    height : 293px;
    width : 0;
    border-right : 150px solid transparent;
    border-bottom : 87px solid black;
    z-index: 3;
    margin-top: 9.5%;
   }
   #triangle2{
    float: left;
    position:absolute;
    height : 338px;
    width : 0;
    border-right : 150px solid transparent;
    border-bottom : 87px solid rgb(181, 163, 248);
    z-index: 4;
   }


#PartieDuHaut {
   
    background-image: linear-gradient(45deg,#2c2cb8, rgba(221, 34, 174, 0.933));
    margin-top: 155px; 
    display: block;
    padding-bottom:1%;
    padding-top: 1%;
    z-index: 1;
}

#PartieDuHaut h1{
font-size: 90px;
font-family: 'Akira';
color: white;
text-align: center;
padding-top: 10px;
}


.p {
    margin-left: 15%;
    text-align: justify;
    
}





#PartieDuMillieu{
    color: white;
    display: block;
    
}


#PartieDuMillieu img,h2,p {
    margin-left: 180px;
    margin-bottom: 30px;
}

.Info{
    background-color: rgb(181, 163, 248);
    padding-top: 30px;
    padding-bottom: 30px;
}
.Info2{
    background-color: rgb(79, 38, 224);
    padding-top: 30px;
    padding-bottom: 30px;
   
}
.Info h2,li {
    color: black;
   
}

.Info h2 ,.Info2 h2{
    font-family: 'Akira';
    font-size: 40px;
}

.Info2 li{
    font-family: 'Galyon-Book';
}

.Contact h1 {
    color: white;
    font-family: 'Akira';
    text-align: center;
    margin-top: 100px;
}
#Instagram{
    width: 8%;
    text-align: center;
    margin-left: 43%;
}

#Twitter{
    width: 85px;
  
}




.flip2{
    margin-left: 24%;
    margin-top: 60px;
}

.flip3 {
    margin-left: 48%;
    margin-top: 60px;
}

.flip4 {
    margin-left: 72%;
    margin-top: 60px;
}

.flip1{
    margin-top: 60px;
}
.ImageFlip {
    background-color: transparent;
    width: 15%;
    height: 38%;
    perspective: 1000px;
    margin-left: 100px;
    margin-top: 50px;
    float:left;
    position: absolute;
    
    
}

.ImageFlipInner {
    position: relative;
    width: 100%;
    height: 100%;
    text-align: center;
    transition: transform 0.6s;
    transform-style: preserve-3d;
}
.ImageFlip:hover .ImageFlipInner {
    transform: rotateY(180deg);
}

.ImageFlipFront,
.ImageFlipBack {
position: absolute;
width: 100%;
height: 100%;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
border-radius: 16px;
display: block;

}
.ImageFlipFront{
    background-image:
     linear-gradient(45deg,#2c2cb8, rgba(221, 34, 174, 0.933));
     font-family: 'Akira';
}
.ImageFlipFront img{
    width: 200px;
}
.ImageFlipBack img {
    width: 220px;
    margin-top: 75px;
}
.ImageFlipBack{
    background-image: linear-gradient(315deg,#2c2cb8, rgba(221, 34, 174, 0.933));
    color: white;
    transform: rotateY(180deg);
}   
.ImageFlipFront h1 {
    color: black;
    font-family: 'Akira';
}
.ImageFlipBack img {
    width: 180px;  
    margin-top: 70px;
}



#PartieDuMillieu {
    font-family: 'Galyon-Book';
    margin-top: 15px;
}

#PartieDuMillieu p {
    margin-top: -1%;
    margin-right: 50%;
    float: left;
    position: absolute;
}

#PartieDuMillieu img {
    margin-left:70% ;
    width: 15%;
}
.kisuisje{
    font-family: 'Akira';
    font-size: 60px;
    margin-left: 10%;
    margin-top: 50px;
    font-stretch:narrower;
}
.EnBasDeFou{
margin-top:450px;
    color: white;
    font-family: 'Galyon-Book';
    margin-bottom: 0;
    margin-left: 0;
}
.EnBasGauche {
    text-align:left;
    margin-top:auto;
    margin-left: 0;
}/*mise en forme de "Valkyries" à gauche*/

.EnBasDroite {
    text-align:right;
    margin-top:-34px;
}/*mise en forme de "Season 1.0" a droite*/